<template>
    <div class="components_edit_modal">
        <el-dialog width="1000px" :title="detailsTitle" :visible.sync="state" :show-close="true" :lock-scroll="true" :close-on-click-modal="false">
            <div class="scrollBarX">
                <el-table :data="syllabusList" border height="400">
                    <el-table-column :show-overflow-tooltip="true" prop="classesNames" align="center" label="班级"></el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="courseName" align="center" label="课程名称"></el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="teachUserName" align="center" label="教师"></el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="semester" align="center" label="学期"></el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="teachDate" align="center" label="上课日期"></el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="teachWeek" align="center" label="教学周">
                        <template slot-scope="scope">
                            第{{scope.row.teachWeek}}周
                        </template>
                    </el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="week" align="center" label="星期">
                        <template slot-scope="scope">
                            星期{{numberList[scope.row.week-1]}}
                        </template>
                    </el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="section" align="center" label="节次">
                        <template slot-scope="scope">
                            第{{scope.row.section}}节
                        </template>
                    </el-table-column>
                    <el-table-column :show-overflow-tooltip="true" prop="teachPlace" align="center" label="上课地点"></el-table-column>
                    <!-- <template v-if="hasPermission()"> -->
                        <el-table-column prop="" align="center" label="操作">
                            <template slot-scope="scope">
                                <a href="JavaScript:void(0);" v-has="'syllabus:deleteLesson'" class="link_txt" @click="delectLesson(scope.row.lessonId)">删除</a>
                            </template>
                        </el-table-column>
                    <!-- </template> -->
                </el-table>
            </div>

            <div slot="footer" class="dialog-footer">
                <!-- <el-button type="primary" size="small">确 定</el-button> -->
                <el-button size="small" @click="state = false">关 闭</el-button>
            </div>

        </el-dialog>

    </div>
</template>

<script>
    import {enums} from '@/constant'
    import {config} from '@/config'
    import week_selector from "../../../common/week-selector"
    export default {
        components: {
            "week-selector":week_selector
        },
        data() {
            return {
                self: this,
                detailsTitle:'',
                state: false,
                numberList:["一","二","三","四","五","六","七","八","九","十","十一","十二"],
                syllabusList:[],
                baseId:null,
                options: {
                    week:[{
                          value: '1',
                          label: '周一'
                        }, {
                          value: '2',
                          label: '周二'
                        }, {
                          value: '3',
                          label: '周三'
                        }, {
                          value: '4',
                          label: '周四'
                        }, {
                          value: '5',
                          label: '周五'
                        }, {
                          value: '6',
                          label: '周六'
                        }, {
                          value: '7',
                          label: '周日'
                        }],
                    section:[{
                            value: '1',
                            label: '第一节'
                        },{
                            value: '2',
                            label: '第二节'
                        },{
                            value: '3',
                            label: '第三节'
                        },{
                            value: '4',
                            label: '第四节'
                        },{
                            value: '5',
                            label: '第五节'
                        },{
                            value: '6',
                            label: '第六节'
                        },{
                            value: '7',
                            label: '第七节'
                        },{
                            value: '8',
                            label: '第八节'
                        },{
                            value: '9',
                            label: '第九节'
                        },{
                            value: '10',
                            label: '第十节'
                        }]
                }
            };
        },
        created() {
            // this.getSyllabus();
        },
        mounted() { },
        watch: {},
        methods: {
            // 打开模态框
            showDialog(val){
                this.professionId = val.professionId;
                this.baseId = val.id;
                this.userId = val.userId;
                this.courseNo = val.courseNo;
                this.semester = val.semester;
                this.detailsTitle = "专业:"+val.professionName +" 课程:"+ val.courseName;
                this.getSyllabusList();
                // console.log(val);
            },
            //请求课程表信息 初始数据
            getSyllabusList(){
                let self = this;
                self.axios.get(api.syllabusManager.queryLessonList,{params:{"baseId":self.baseId,"userId":self.userId}}).then((response) => {
                    if(response.data.success){
                        // console.log(response.data);
                        if(response.data.data.length > 0){
                            self.syllabusList = JSON.parse(JSON.stringify(response.data.data));
                            self.state = true;
                        }else{
                            // 操作失败
                            self.$message({
                                message: "还没有配置课程表信息！",
                                type:'error',
                                center: true
                            });
                        }
                    }else{
                        // 操作失败
                        self.$message({
                            message: response.data.msg,
                            type:'error',
                            center: true
                        });
                    }

                });
            },
            weekFormative(n){
                let weekArr=["星期一","星期二","星期三","星期四","星期五","星期六","星期日"]
            },
            // 删除一堂课
            delectLesson(val){
                let self = this;
                this.$confirm('是否删除此堂课程?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {  //确认删除课程表
                    self.axios.delete(api.syllabusManager.deleteLesson + val).then((response) => {
                        if(response.data.success){
                            // 更新列表
                            self.getSyllabusList();
                            // 重置成功打开添加页面
                            // self.$refs.syllabusAdd.showDialog(val);
                        }else{
                            // 操作失败
                            self.$message({
                                message: response.data.msg,
                                type:'error',
                                center: true
                            });
                        }

                    });
                }).catch(() => {
                    // 取消弹层
                })
            }
        },
    };
</script>
<style scoped>

</style>